<template>
    <van-nav-bar class="myhead" :title="title" fixed :z-index="1000">
        <template #right>
            <van-popover @select="choosepage" v-model="showPopover" theme="dark" trigger="click" :actions="actions" placement="bottom-end">
                <template #reference>
                    <van-icon name="ellipsis" color="#fb7299" />
                </template>
            </van-popover>
        </template>
        <template #left v-if="back">
            <slot>
                <van-icon @click="gotoback" name="arrow-left" color="#fb7299" />
            </slot>
        </template>
    </van-nav-bar>
</template>

<script>
    export default{
        data() {
            return {
                showPopover: false,
            actions: [
                { text: '会员购' ,icon:'goods-collect-o',value:"/king",disabled:this.$route.name=='king'}, 
                { text: '分类' ,icon:'qr',value:"/shop",disabled:this.$route.name=='shop'}, 
                { text: '购物车' ,icon:'shopping-cart-o',value:"/cart",disabled:this.$route.name=='cart'},
                { text: '我的' ,icon:'user-o',value:"/mine",disabled:this.$route.name=='mine'},
                { text: '搜索' ,icon:'search',value:"/search",disabled:this.$route.name=='search'},
               
            ],
            }
        },
        props:{
            title:String,
            back: {
                type:Boolean,
                default: true,
            }
        },
        methods: {
            gotoback(){
                this.$router.go(-1)
            },
            choosepage(arg){
                console.log(arg);
                this.$router.push({path:arg.value})
            }
        }
    }
</script>